<!--过滤查询-->
<nz-row>
  <div class="searchItem">
    <label for="typeName">机型名称</label>
    <input id="typeName" nz-input placeholder="请输入机型名称" [(ngModel)]="query.typeName"/>
  </div>
  <div class="searchItem">
    <label>内部备注</label>
    <input nz-input placeholder="请输入内部备注" [(ngModel)]="query.remarks"/>
  </div>
  <div class="searchItem">
    <label for="brand">所属品牌</label>
    <nz-select id="brand" [(ngModel)]="query.brand" nzPlaceHolder="请选择所属品牌"
               (ngModelChange)="setDepartmentOptions(query.brand)" [nzBackdrop]="true" nzShowSearch nzAllowClear>
      <nz-option [nzValue]="brand.id" [nzLabel]="brand.name" *ngFor="let brand of brandOptions"></nz-option>
    </nz-select>
  </div>
  <div class="searchItem">
    <label for="department">所属系列</label>
    <nz-select id="department" [(ngModel)]="query.department" nzPlaceHolder="请选择所属系列" [nzBackdrop]="true" nzShowSearch
               nzAllowClear>
      <nz-option [nzValue]="department.id" [nzLabel]="department.name"
                 *ngFor="let department of departmentOptions"></nz-option>
    </nz-select>
  </div>
  <div class="searchItem">
    <label for="evalStatus">状态</label>
    <nz-select id="evalStatus" [(ngModel)]="query.evalStatus" nzPlaceHolder="请选择状态" [nzBackdrop]="true" nzAllowClear>
      <nz-option [nzValue]="0" nzLabel="下架"></nz-option>
      <nz-option [nzValue]="1" nzLabel="上架"></nz-option>
    </nz-select>
  </div>
  <div class="searchItem">
    <label for="template">估价模版</label>
    <nz-select id="template" [(ngModel)]="query.template" nzPlaceHolder="请选择关联估价模版" [nzBackdrop]="true" nzShowSearch
               nzAllowClear>
      <nz-option [nzValue]="question.id" [nzLabel]="question.title"
                 *ngFor="let question of templateOptions"></nz-option>
    </nz-select>
  </div>
  <div class="searchItem">
    <label for="date">更新时间</label>
    <nz-range-picker id="date" nzFormat="yyyy-MM-dd" [(ngModel)]="query.date"></nz-range-picker>
  </div>
  <div class="searchItem">
    <button nz-button nzType="primary" (click)="queryBtn()">查询</button>
    <button nz-button nzType="default" (click)="resetCondition()">重置</button>
    <button nz-button nzType="primary" (click)="gotoPage()">新增机型估价</button>
    <button nz-button nzType="primary" (click)="export()">导出</button>
    <button
      nz-button
      nzType="primary"
      class="mbtn-green"
      [nzLoading]="exportBenchmarkPriceLoading"
      (click)="exportBenchmarkPrice()"
    >导出基准价</button>
  </div>
</nz-row>
<!--表格-->
<nz-table
  #rowSelectionTable
  nzSize="small"
  nzTableLayout="fixed"
  nzShowSizeChanger
  nzShowQuickJumper
  nzOuterBordered
  [nzData]="listOfData.records"
  [nzPageSizeOptions]="[5, 10, 20, 50, 100]"
  [nzTotal]="listOfData.total"
  [(nzPageIndex)]="query.page"
  [(nzPageSize)]="query.pageSize"
  [nzFrontPagination]="false"
  [nzShowTotal]="totalTemplate"
  (nzPageIndexChange)="onPageIndexChange($event)"
  (nzPageSizeChange)="onPageSizeChange($event)"
>
  <thead>
  <tr>
    <th nzAlign="center" [nzWidth]="'100px'">ID</th>
    <th nzAlign="center" [nzWidth]="'100px'">机型ID</th>
    <th nzAlign="center">机型名称</th>
    <th nzAlign="center">所属品牌</th>
    <th nzAlign="center">所属系列</th>
    <th nzAlign="center">估价模版</th>
    <th nzAlign="center">内部备注</th>
    <th nzAlign="center">更新时间</th>
    <th nzAlign="center">状态</th>
    <th nzAlign="center" nzWidth="250px">操作</th>
  </tr>
  </thead>
  <tbody>
  <tr *ngFor="let data of rowSelectionTable.data;let index=index;">
    <td nzAlign="center">{{ data['evaluationId'] }}</td>
    <td nzAlign="center">{{ data['id'] }}</td>
    <td nzAlign="center" style="white-space: pre">{{ data['name'] }}</td>
    <td nzAlign="center">{{ data['brandName'] }}</td>
    <td nzAlign="center">{{ data['seriesName'] }}</td>
    <td nzAlign="center">{{ data['evalName'] }}</td>
    <td nzAlign="center">{{ data['remarks'] }}</td>
    <td nzAlign="center">{{ data['updateTime'] }}</td>
    <td nzAlign="center" [attr.evalStatus]="data['evalStatus']">{{ data['evalStatus'] === 0 ? '下架' : '上架' }}</td>

    <td nzAlign="center">
      <a (click)="copyAssessType(data)">复制</a>
      <a (click)="viewAssessType(data)">查看</a>
      <a (click)="preview(data)">预览</a>
      <!--      <a>复制</a>-->
      <a (click)="modify(data)">编辑</a>
      <a style="color: #F56C6C" (click)="changeStatus(data,0)" *ngIf="data['evalStatus']===1">下架</a>
      <a style="color: #27D525"
         nzPopconfirmPlacement="top"
         nz-popconfirm
         nzPopconfirmTitle="确认要上架?"
         nzOkText="确认"
         nzCancelText="取消"
         (nzOnConfirm)="changeStatus(data,1)" *ngIf="data['evalStatus']===0">上架</a>
      <a style="color: #F56C6C"
         nzPopconfirmPlacement="top"
         nz-popconfirm
         nzPopconfirmTitle="确认要删除该数据吗?"
         nzOkText="确认"
         nzCancelText="取消"
         (nzOnConfirm)="deleteRow(data)">删除</a>
    </td>
  </tr>
  </tbody>
</nz-table>
<!-- 分页template -->
<ng-template #totalTemplate let-total>共有 {{ listOfData.total }} 条</ng-template>

<app-preview-assess-type *ngIf="previewAssessTypeVisible" [visible]="previewAssessTypeVisible"
                         (visibleChange)="previewAssessTypeVisible=!previewAssessTypeVisible"
                         [formData]="formData" [baseQuestion]="baseQuestion"
                         [questionList]="questionList"></app-preview-assess-type>

<!--编辑一口价-->
<nz-modal [(nzVisible)]="copyAssessTypeModal.visible" nzTitle="复制" nzWidth="400px"
          (nzOnCancel)="hideAssessTypeModal()">
  <div *nzModalContent>
    <div class="flexRow">
      <label for="copyBrand">品牌:</label>
      <nz-select id="copyBrand" [(ngModel)]="copyAssessTypeModal.brandId" nzPlaceHolder="请选择品牌"
                 (ngModelChange)="setCopyDepartmentOptions(copyAssessTypeModal.brandId)" [nzBackdrop]="true" nzShowSearch nzAllowClear>
        <nz-option [nzValue]="brand['id']" [nzLabel]="brand['name']" *ngFor="let brand of brandOptions"></nz-option>
      </nz-select>
    </div>
    <div class="flexRow">
      <label for="copyDepartment">系列:</label>
      <nz-select id="copyDepartment" [(ngModel)]="copyAssessTypeModal.seriesId" nzPlaceHolder="请选择系列"
                 (ngModelChange)="setCopyTypeOptions(copyAssessTypeModal.seriesId)" [nzBackdrop]="true" nzShowSearch nzAllowClear>
        <nz-option [nzValue]="department['id']" [nzLabel]="department['name']"
                   *ngFor="let department of copyAssessTypeModal.departmentOptions"></nz-option>
      </nz-select>
    </div>
    <div class="flexRow">
      <label for="copyType"><span>*</span>机型:</label>
      <nz-select id="copyType" [(ngModel)]="copyAssessTypeModal.id" nzPlaceHolder="请选择机型"
                 [nzBackdrop]="true" nzShowSearch
                 nzAllowClear>
        <nz-option [nzValue]="type['id']" [nzLabel]="type['name']" *ngFor="let type of copyAssessTypeModal.typeOptions"></nz-option>
      </nz-select>
    </div>
  </div>
  <div *nzModalFooter>
    <button nz-button nzType="default" (click)="hideAssessTypeModal()">关闭</button>
    <button nz-button nzType="primary" (click)="saveAssessTypeModal()">确认</button>
  </div>
</nz-modal>
